<!--奢侈品商品详情-->
<template>
	<div id="luxuryGoodsDetail" class="container-fluid">

		<!--商品动态-->
	     <div class="panel panel-default">
	      <div class="panel-heading">
	        <h3 class="panel-title">商品动态</h3>
	      </div>
	      <div class="panel-body">
	        
	      </div>
	    </div>


	    <!--商品基本信-->
	     <div class="panel panel-info">
	      <div class="panel-heading">
	        <h3 class="panel-title">商品基本信息</h3>
	      </div>
	      <div class="panel-body">
	        	<table class="table table-striped table table-bordered table-condensed">
	        		
	        		<tbody>
	        			<tr>
	        				<th>商品分类</th>
	        				<td>{{data.productCategoryName?data.productCategoryName:''}}</td>
	        			</tr>
	        			<tr>
	        				<th>商品标题</th>
	        				<td>{{data.name}}</td>
	        			</tr>
	        			<tr>
	        				<th>商品标题</th>
	        				<td>{{data.productTitle}}</td>
	        			</tr>
	        			<tr>
	        				<th>品牌</th>
	        				<td>{{data.brandName}}</td>
	        			</tr>
	        			<tr>
	        				<th>商品售价</th>
	        				<td>{{data.currentPrice}}</td>
	        			</tr>
	        			<tr>
	        				<th>市场价格</th>
	        				<td>{{data.basicPrice}}</td>
	        			</tr>
	        			<tr>
	        				<th>图片</th>
	        				<td>
	        						<template v-for="img in data.spuImages">

	        								<img :src="img">
	        							
	        						</template>
	        				</td>
	        			</tr>
	        		</tbody>

	        	</table>
	      </div>
	    </div>
	       <!--商品属性信息-->
	     <div class="panel panel-success">
	      <div class="panel-heading">
	        <h3 class="panel-title">商品属性信息</h3>
	      </div>
	      <div class="panel-body">
	        	<table class="table table-striped table table-bordered table-condensed">
	        		<tbody>
	        			<tr>
	        				<th>
	        					编码
	        				</th>
	        				<th>
	        					库存
	        				</th>
	        				<th>
	        					价格
	        				</th>
	        				<th>
	        					备注
	        				</th>
	        				<template v-for=" attr in data.productSku[0].attribute">
	        					<th>
	        						{{attr.attribute}}
	        					</th>
	        				</template>
	        				<th>图片</th>
	        				
	        			</tr>

	        			<tr v-for="sku in data.productSku">
	        				<td>{{sku.productCode}}</td>
	        				<td>{{sku.availableQuantity}}</td>
	        				<td>{{sku.currentPrice}}</td>
	        				<td>{{sku.currentPrice}}</td>
	        				<td v-for="attVal in  sku.attribute">
	        					{{attVal.attributeValue}}
	        				</td>
	        				<td>
	        					<template v-for="img in sku.skuImages">
	        							<img :src="img">
	        					</template>
	        				</td>
	        			</tr>

	        		</tbody>
	        	</table>
	      </div>
	    </div>
	    <!--商品售卖与物流信息-->
	     <div class="panel panel-primary">
	      <div class="panel-heading">
	        <h3 class="panel-title">商品售卖与物流信息</h3>
	      </div>
	      <div class="panel-body">
	        <table class="table table-striped table table-bordered table-condensed">
	        
	        	<tbody>
	        		<tr>
	        			<th>交易类型</th>
	        			<td>{{data.isSchedule | jiaoyileixing}}</td>
	        		</tr>
	        		<tr>		
	        			<th>物流配送</th>
	        			<td>{{data.distributionMode | spuPeisong}}</td>
	        		</tr>
	        		<tr	
	        			<th>运费设置</th>
	        			<td>{{data.freightSet | yunfeishezhi}}</td>
	        		</tr>
	        		<tr>	
	        			<th>退换服务</th>
	        			<td>{{data.returnGoodsServe | tuihuanhuofuwu}}</td>
	        		</tr>
	        		<tr>	
	        			<th>返利设置</th>
	        			<td>暂无</td>
	        		</tr>
	        	</tbody>
	        </table>
	      </div>
	    </div>

	   	<!--商品参数信息-->
	     <div class="panel panel-warning">
	      <div class="panel-heading">
	        <h3 class="panel-title">商品参数信息</h3>
	      </div>
	      <div class="panel-body">
	        	<table class="table table-striped table table-bordered table-condensed">
	        
	        	<tbody>
	        		<tr v-for="spuAttr in data.spuAttributeRelation">
	        			<th>{{spuAttr.attribute}}</th>
	        			<td>{{spuAttr.attributeValue}}</td>
	        		</tr>
	        	</tbody>
	        </table>
	      </div>
	    </div>


	   	<!--商品详情-->
	     <div class="panel panel-danger">
	      <div class="panel-heading">
	        <h3 class="panel-title">商品详情</h3>
	      </div>
	      <div class="panel-body" v-html="data.productDescLong">
	      </div>
	    </div>
		
	</div>
</template>

<script>
import axios from 'axios'
export default{
	data(){
		return {
			data:{},
		}
	},
	mounted(){
		this.init();
	},
	methods:{
		init(){
			let param={};
			param.id=this.$route.params.id
			axios.post("/api/luxuryProduct/queryProductDetails",param).then((res) => {
				this.data=eval(res.data.data);
				console.info(res.data);
			},(res) => {

			})
		},
	}
}



</script>

<style>
	table img{width:100px;height:80px;}
</style>



